<!DOCTYPE html>
<html lang="cn-zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>魅族</title>
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/float-structure.css">
    <link rel="stylesheet" href="./css/header.css">
    <link rel="stylesheet" href="./css/nav.css">
    <link rel="stylesheet" href="./css/main-nav.css">
    <link rel="stylesheet" href="./css/main-hot.css">
    <link rel="stylesheet" href="./css/main-phone.css">
    <link rel="stylesheet" href="./css/footer.css">
    <link rel="stylesheet" href="./css/web-bottom.css">
</head>

<body>
    <!-- header开始 -->
    <header class="header">
        <div class="heart header-c">
            <ul class="l">
                <li><a href="javascript:;">魅族官网</a></li>
                <li><a href="javascript:;">魅族商城</a></li>
                <li><a href="javascript:;">Flyme</a></li>
                <li><a href="javascript:;">专卖店</a></li>
                <li><a href="javascript:;">服务</a></li>
                <li><a href="javascript:;">社区</a></li>
            </ul>
            <ul class="r">
                <li><a href="javascript:;">我的收藏</a><i></i></li>
                <li><a href="javascript:;">我的订单</a></li>
                <li><a href="javascript:;">登录</a></li>
                <li><a href="javascript:;">注册</a></li>
            </ul>
        </div>
    </header>
    <!-- header结束 -->
    <!-- nav开始 -->
    <nav class="nav">
        <div class="heart nav-c">
            <h1><a href="javascript:;">魅族</a></h1>
            <ul class="l">
                <li><a href="javascript:;">PRO手机</a></li>
                <li><a href="javascript:;">魅蓝手机</a></li>
                <li><a href="javascript:;">MX手机</a></li>
                <li><a href="javascript:;">精选配件</a></li>
                <li><a href="javascript:;">智能硬件</a></li>
            </ul>
        </div>

    </nav>
    <!-- nav结束 -->
    <!-- main开始 -->
    <main class="content">
        <div class="heart">
            <!-- 轮播图 -->
            <div class="main-nav rotation">
                <!-- 图片列表 -->
                <ul class="images">
                    <li class="show"><a href="javascript:;"><img src="./images/banner.jpg" alt=""></a></li>
                    <li><a href="javascript:;"><img src="./images/banner.jpg" alt=""></a></li>
                    <li><a href="javascript:;"><img src="./images/banner.jpg" alt=""></a></li>
                    <li><a href="javascript:;"><img src="./images/banner.jpg" alt=""></a></li>
                    <li><a href="javascript:;"><img src="./images/banner.jpg" alt=""></a></li>
                </ul>
                <!-- 左右键头按钮 -->
                <div>
                    <a href="javascript:;" class="btn btn-l"></a>
                    <a href="javascript:;" class="btn btn-r"></a>
                </div>
                <!-- 底部小标签 -->
                <ol>
                    <li class="now"></li>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                </ol>
                <!-- 左侧分类列表 -->
                <ul class="list">
                    <li>全部商品分类</li>
                    <li>手机</li>
                    <li>智能硬件</li>
                    <li>耳机 / 音箱</li>
                    <li>路由器 / 移动电源</li>
                    <li>保护套 / 后盖 / 贴膜</li>
                    <li>数据线 / 电源适配器</li>
                    <li>周边配件</li>
                </ul>
            </div>
            <!-- 热点 -->
            <div class="hot">
                <ul class="float-structure hot-list">
                    <li>
                        <ul>
                            <li><a href="javascript:;"><img src="./images/1450855246-61162.png" alt="">
                                    <p>M码通道</p>
                                </a></li>
                            <li><a href="javascript:;"><img src="./images/1450855279-64872.png" alt="">
                                    <p>以旧换新</p>
                                </a></li>
                            <li><a href="javascript:;"><img src="./images/1450855198-58056.png" alt="">
                                    <p>魅族意外保</p>
                                </a></li>
                            <li><a href="javascript:;"><img src="./images/1451960447-93534.png" alt="">
                                    <p>回购单查询</p>
                                </a></li>
                        </ul>
                    </li>
                    <li><a href="javascript:;"><img src="./images/1469442560-64371.jpg" alt=""></a></li>
                    <li><a href="javascript:;"><img src="./images/Cix_s1fuEgmAc5NwAABEl576SHY123.jpg" alt=""></a></li>
                    <li><a href="javascript:;"><img src="./images/CnQOjVfhDa2AKtdyAAAtKjihE5E114.jpg" alt=""></a></li>
                    <li><a href="javascript:;"><img src="./images/Cix_s1f66-eAGausAABXAszHWuE990.png" alt=""></a></li>
                </ul>
            </div>
            <!-- 手机 -->
        </div>
        <div class="phone">
            <div class="heart phone-c">
                <div>
                    <span class="l">手机</span>
                    <span class="r">更多 <i></i></span>
                </div>
                <ul class="float-structure phone-list">
                    <li>
                        <a href="javascript:;">
                            <img src="./images/CnQOjVf6EfOAKlj2AAvhVMfnh40856_180x180.png" alt="">
                            <p class="phone-name">魅蓝note3</p>
                            <p class="phone-time">11日-12日 限量开售</p>
                            <p class="phone-pice">¥ 799</p>
                            <span class="rm">热卖</span>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;">
                            <img src="./images/CnQOjVf8Qm2AGJwmAAf5c4NUNpI085_180x180.png" alt="">
                            <p class="phone-name">魅蓝3</p>
                            <p class="phone-time">11日-12日 限量开售</p>
                            <p class="phone-pice">¥ 699</p>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;">
                            <img src="./images/Cix_s1f6EZaAMxvjAA2l_exLROk326_180x180.png" alt="">
                            <p class="phone-name">魅蓝3s</p>
                            <p class="phone-time">11日-12日 限量开售</p>
                            <p class="phone-pice">¥ 699</p>
                            <span class="rm">热卖</span>  
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;">
                            <img src="./images/CnQOjVf4y6iAe-3RAAbqolcyaco939_180x180.png" alt="">
                            <p class="phone-name">魅蓝metal</p>
                            <p class="phone-time">领券立减100元</p>
                            <p class="phone-pice">¥ 999</p>
                            <span class="th">特惠</span>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;">
                            <img src="./images/CnQOjVffSHOAaRkmAA0Rkx2XjKE222_180x180.png" alt="">
                            <p class="phone-name">魅蓝E</p>
                            <p class="phone-time">全网通 多彩金属机身</p>
                            <p class="phone-pice">¥ 1299</p>
                            <span class="rm">热卖</span>
                        </a>
                    </li>
                    
                </ul>
            </div>
        </div>
        </div>
    </main>
    <!-- content结束 -->
    <!-- fotter开始 -->
    <footer class="footer">
        <div class="heart footer-c">
            <div class="l">
                <dl>
                    <dt>帮助说明</dt>
                    <dd><a href="javascript:;">支付方式</a></dd>
                    <dd><a href="javascript:;">配送说明</a></dd>
                    <dd><a href="javascript:;">售后服务</a></dd>
                    <dd><a href="javascript:;">付款帮助</a></dd>
                </dl>
                <dl>
                    <dt>Flyme</dt>
                    <dd><a href="javascript:;">开放平台</a></dd>
                    <dd><a href="javascript:;">固件下载</a></dd>
                    <dd><a href="javascript:;">软件商店</a></dd>
                    <dd><a href="javascript:;">查找手机</a></dd>
                </dl>
                <dl>
                    <dt>关于我们</dt>
                    <dd><a href="javascript:;">关于魅族</a></dd>
                    <dd><a href="javascript:;">加入我们</a></dd>
                    <dd><a href="javascript:;">联系我们</a></dd>
                    <dd><a href="javascript:;">法律声明</a></dd>
                </dl>
                <dl>
                    <dt>关注我们</dt>
                    <dd><a href="javascript:;">新浪微博</a></dd>
                    <dd><a href="javascript:;">腾讯微博</a></dd>
                    <dd><a href="javascript:;">QQ空间</a></dd>
                    <dd><a href="javascript:;">官方微信</a></dd>
                </dl>
            </div>
            <div class="r">
                <p>24小时全国服务热线</p>
                <p>400-788-3333</p>
                <p>24小时在线客服</p>
            </div>
        </div>
    </footer>
    <!-- fotter结束 -->
    <!-- web-bottom开始 -->
    <div class="web-bottom">
        <div class="heart web-bottom-c">
            <span>2016 Meizu Telecom Equipment Co., Ltd. All rights reserved.</span>
            <span>备案号：粤ICP备13003602号-2</span>
            <span>经营许可证编号：粤B2-20130198</span>
            <span>营业执照<i></i></span>
        </div>
    </div>
    <!-- web-bottom结束 -->
</body>

</html>